import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:mobile_vpn/common/cpn/cpn_view_state.dart';
import 'package:mobile_vpn/pages/my_page/my_logic.dart';
import 'package:mobile_vpn/router/routers.dart';
import '../../theme/color_palettes.dart';
import 'dart:io' show Platform;

class MyPage extends CpnViewState<MyLogic> {

  MyPage({Key? key}) : super(key: key, bindViewState: false);
  final RxBool isMember = false.obs; // 新增会员状态

  @override
  Widget buildBody(BuildContext context) {
    return ListView(
      padding: EdgeInsets.symmetric(horizontal: 32.w),
      children: [
        Padding(
          padding: EdgeInsets.only(top: 60.h), // 设置顶部间距
          child: _buildUserInfoSection(),
        ),
        _buildSettingsSection(),
      ],
    );
  }

  // 用户信息部分
  Widget _buildUserInfoSection() {
    return Padding(
      padding: EdgeInsets.all(32.w),
      child: Row(
        children: [
          // 头像
          GestureDetector(
            onTap: () {
              AppRoutes.jumpPage(AppRoutes.userPage);
              print('查看用户详情');
            },
            child: CircleAvatar(
              radius: 60.r,
              backgroundColor: ColorPalettes.instance.primary,
              child: Icon(Icons.person, size: 40.r, color: Colors.white),
            ),
          ),
          SizedBox(width: 32.w),
          // 用户信息
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  '用户名',
                  style: TextStyle(
                    fontSize: 18.sp,
                    fontWeight: FontWeight.bold,
                    color: ColorPalettes.instance.firstText,
                  ),
                ),
                SizedBox(height: 8.w),
                Text(
                  isMember.value ? 'VIP会员' : '非会员',
                  style: TextStyle(
                    fontSize: 32.sp,
                    color: ColorPalettes.instance.firstText,
                  ),
                ),
              ],
            ),
          ),
          // 组合按钮
          Align(
            alignment: Alignment.centerRight,
            child: _buildCombinedButtons(),
          ),
        ],
      ),
    );
  }

  // 构建组合按钮（升级+开通）
  Widget _buildCombinedButtons() {
    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(32.r),
        gradient: LinearGradient(
          colors: [ColorPalettes.instance.primary, ColorPalettes.instance.secondary],
          begin: Alignment.centerLeft,
          end: Alignment.centerRight,
        ),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          // 升级按钮
          ElevatedButton(
            onPressed: !isMember.value ? null : () {
              print('升级会员');
            },
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.transparent,
              foregroundColor: isMember.value ? Colors.grey : ColorPalettes.instance.firstText,
              padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 24.h),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(32.r),
                  bottomLeft: Radius.circular(32.r),
                ),
              ),
            ),
            child: Text(
              '升级会员',
              style: TextStyle(
                fontSize: 15.sp,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
          // 开通/续费按钮
          ElevatedButton(
            onPressed: () {
              if (isMember.value) {
                print('立即续费');
              } else {
                print('立即开通');
              }
            },
            style: ElevatedButton.styleFrom(
              backgroundColor: Colors.transparent,
              foregroundColor: ColorPalettes.instance.firstText,
              padding: EdgeInsets.symmetric(horizontal: 24.w, vertical: 24.h),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.only(
                  topRight: Radius.circular(32.r),
                  bottomRight: Radius.circular(32.r),
                ),
              ),
            ),
            child: Text(
              isMember.value ? '立即续费' : '立即开通',
              style: TextStyle(
                fontSize: 15.sp,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),
        ],
      ),
    );
  }

  // 通用列表项
  Widget _buildListTile({
    required IconData icon,
    required String title,
    Widget? trailing,
    VoidCallback? onTap,
  }) {
    return ListTile(
      leading: Icon(
        icon,
        color: ColorPalettes.instance.firstIcon,
        size: 26.sp
      ),
      title: Text(
        title,
        style: TextStyle(
          color: ColorPalettes.instance.firstText,
          fontSize: 32.sp,
        ),
      ),
      trailing: trailing ??
          Icon(
            Icons.arrow_forward_ios,
            color: ColorPalettes.instance.firstIcon,
            size:28.sp,
          ),
      onTap: onTap ?? () {},
    );
  }

  // 设置部分
  Widget _buildSettingsSection() {
    return Column(
      children: [
        _buildListTile(
          icon: Icons.headset_mic,
          title: '联系客服',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.contactServerPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.feedback,
          title: '反馈问题',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.feedbackPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.info_outline,
          title: '关于我们',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.aboutPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.privacy_tip,
          title: '隐私政策',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.privacyPolicyPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.description,
          title: '服务协议',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.serviceAgreementPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.system_update,
          title: '版本信息',
          trailing: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(
                'v1.0.0',
                style: TextStyle(
                  fontSize: 18.sp,
                  color: ColorPalettes.instance.firstText,
                ),
              ),
              SizedBox(width: 8.w),
              Icon(
                Icons.arrow_forward_ios,
                color: ColorPalettes.instance.firstIcon,
                size: 16.sp,
              ),
            ],
          ),
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.versionPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.settings,
          title: '设置',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.setPage);
          },
        ),
        SizedBox(height: 20.h),
        _buildListTile(
          icon: Icons.notifications,
          title: '消息中心',
          onTap: () {
            AppRoutes.jumpPage(AppRoutes.messageCenterPage);
          },
        ),
      ],
    );
  }
}
